<script lang="ts">
export default {
  name: "OperateMethodProfile"
}
</script>

<template>
  <el-descriptions
    ref="dataFormRef"
    :column="2"
    :model="dataState.formData"
    border
  >
    <el-descriptions-item label="任务名称"> {{ dataState.formData.taskName }}</el-descriptions-item>

    <el-descriptions-item label="数据范围"> {{ dataState.sourceType }}</el-descriptions-item>

    <el-descriptions-item label="设备厂商"> {{ dataState.manufacturer }}</el-descriptions-item>

    <el-descriptions-item label="设备类型"> {{ dataState.deviceType }}</el-descriptions-item>

    <el-descriptions-item label="缓存深度"> {{ dataState.cacheSize }}</el-descriptions-item>

    <el-descriptions-item label="创建时间"> {{ formatDate(dataState.formData.createTime) }}
    </el-descriptions-item>

    <el-descriptions-item label="更新时间"> {{ formatDate(dataState.formData.updateTime) }}
    </el-descriptions-item>

  </el-descriptions>
</template>

<script lang="ts" setup>

import {onMounted, reactive, ref} from "vue";

import {ElForm} from "element-plus";

import {formatDate,} from '@/utils/formatter';

const dataFormRef = ref(ElForm); // 属性名必须和元素的ref属性值一致

/**
 * 对外声明接口：父页面可以调用它
 */
defineExpose({initData});

// 数据状态：定义
let dataState = reactive({
  // 类型：create/update
  type: 'create',
  // 标题
  title: '详细信息',
  taskId: 0,
  sourceType: '',
  manufacturer: '',
  deviceType: '',
  deviceName: '',
  cacheSize: '',
  // 表单数据
  formData: {} as any,
});

function initData(entity: any) {
  dataState.formData = entity;

  dataState.sourceType = entity.taskParam.dataSource.sourceType;
  dataState.manufacturer = entity.taskParam.dataSource.manufacturer;
  dataState.deviceType = entity.taskParam.dataSource.deviceType;
  dataState.deviceName = entity.taskParam.dataSource.deviceName;
  dataState.cacheSize = entity.taskParam.cacheSize;
}

function getHrefParams() {
  let tag = "/device-valuex/device-valuex-script?";
  let start = location.href.indexOf(tag);
  if (start <= 0) {
    return;
  }

  let params = location.href.substring(start + tag.length);
  let taskId = params.split("=").at(1);
  dataState.taskId = Number.parseInt(taskId as string);
}

onMounted(() => {
  // 从url上获得key
  getHrefParams();
});

</script>
